<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../css/bootstrap.min.css">
<script src="../js/jquery-1.11.1.min.js"></script>
<link rel="stylesheet" href="../css/wpl_style.css">
<script src="../js/bootstrap.min.js"></script>
<?php include 'dbInclude.php';?>
<?php 
	 $msg = "";
	 
	 if(!empty($_GET["msg"])){
		$msg = $_GET['msg'];
	 }
	 $rows=$dbh->query("SELECT * FROM `instrument_master`;");
	 
	 ?>
</head>
<body class="gridBody">

		<div id="btndiv">
<label style="width:100%;text-align:center">Order Panel</label>

</div>
			<div class="orderPanel">
				<form role="form" id="orderForm" action="./orderSubmit.php" autocomplete="off" method="post" >
					<div class="form-group">
					
					</div>
					<div class="row">
						<div class="col-xs-12 col-sm-12 col-md-12">
						 <label id="error" for="error"><?php echo $msg; ?></label>
						</div>  
					</div>
					<div class="row">
						<div class="col-xs-3 col-sm-3 col-md-3">
							<div class="form-group">
								<input type="text" name="cname" list="companyNames" id="cname" class="form-control cname" placeholder="Name">
								<datalist id="companyNames">
								<?php
								foreach ($rows as $row) {
								echo "<option id='".$row["INSTR_ID"]."' value ='".$row["INSTR_NAME"]."'>";
								}
								?>
								</datalist>
								<input type="hidden" name="cid" id="cid" value="" />
								<div id="fill" style="border:1px solid grey;width:30%;display:none; position: absolute;left:46%;z-index:100;background:gray;"> </div>
							</div>
						</div>
						<div class="col-xs-3 col-sm-3 col-md-3">
							<div class="form-group">
								<input type="text" name="qnty" id="qnt" class="form-control " placeholder="Quantity">
							</div>
						</div>
						<div class="col-xs-3 col-sm-3 col-md-3">
							<div class="form-group">
								<select name="buysell" class="form-control"><option value="1">Buy</option><option value="0">Sell</option></select>
							</div>
						</div>
						<div class="col-xs-3 col-sm-3 col-md-3">
							<div class="form-group">
								<button type="submit" id="submit" class="btn btn-info btn-block">Submit</button>
							</div>
						</div>
					</div>
				</form>
			</div>


</body>
<script>
// $("#cname").keyup(function(){
// var data = $("#cname").val();
// //alert(data); 
// if(data!="")
// {
// $.ajax({
  // type: "POST",
  // url: "ajax_name.php?data="+data,
  
// })
  // .done(function( data ) {
  
    // $("#fill").html(data);
	// $("#fill").css("display","block");
	// //alert(data);
	// });
// }
// else
// {
	// $("#fill").css("display","none");
// }
// });
$(document).ready(function() {

	$("#cname").change( function(){

		    var x = document.getElementById("companyNames");
			var i;
			for (i = 0; i < x.options.length; i++) {
				if(x.options[i].value == $(this).val()){
					//alert($(x.options[i]).attr('id'));
					$cid = $(x.options[i]).attr('id');
					$("#cid").val($cid);
				}
			}
		
	});
	$("#orderForm").submit(function( event ) {
	
		var x = document.getElementById("companyNames");
		var i;
		for (i = 0; i < x.options.length; i++) {
			if(x.options[i].value == $("#cname").val()){
				return;
			}
		}
		$( "#error" ).empty();
		$( "#error" ).text( "Please select a valid company name" ).show();
		event.preventDefault();
	});
    $("#qnt").keydown(function (e) {
        // Allow: backspace, delete, tab, escape, enter and .
        if ($.inArray(e.keyCode, [46, 8, 9, 27, 13, 110, 190]) !== -1 ||
             // Allow: Ctrl+A
            (e.keyCode == 65 && e.ctrlKey === true) || 
             // Allow: home, end, left, right
            (e.keyCode >= 35 && e.keyCode <= 39)) {
                 // let it happen, don't do anything
                 return;
        }
        // Ensure that it is a number and stop the keypress
        if ((e.shiftKey || (e.keyCode < 48 || e.keyCode > 57)) && (e.keyCode < 96 || e.keyCode > 105)) {
            e.preventDefault();
        }
    });
});
</script>
</html>